body {
    background-color: #f5f5f5;
}

.swiper_bg {
    margin-top: 1rem;
    height: 8.65rem;
    width: 100%;
    overflow: hidden;
    .swiper {
        width: 100%;
        height: 7.1rem;
        overflow: visible;
        .swiper-slide {
            overflow: hidden;
            // transform: scale(.8);
        }
        // .swiper-slide::after{
        //   width: 100%;
        //   height: 100%;
        //   position: absolute;
        //   content: "";
        //   display: block;
        //   border-radius: .4rem;
        //   top: 0;
        //   left: 0;
        //   background: #000;
        //   opacity: .3;
        // }
        // .swiper-slide-active::after{
        //   width: 100%;
        //   height: 100%;
        //   position: absolute;
        //   content: "";
        //   display: block;
        //   top: 0;
        //   left: 0;
        //   background: #000;
        //   opacity: 0;
        // }
        .swiper-slide {
            width: 16.75rem;
            img {
                width: 100%;
                border-radius: 6px;
                box-shadow: 0 20px 20px #e3e3e3;
            }
        }
    }
    .swiper-pagination {
        transform: translate(-50%, 1.4rem)!important;
        width: .6rem;
        height: .6rem;
    }
    .swiper-pagination-bullet {
        background-color: #b9cfe6!important;
    }
    .swiper-pagination-bullet-active-main {
        background-color: #b9cfe6!important;
    }
}

.page_content {
    width: calc(100% - 1.5rem);
    margin: auto;
    .page {
        border-radius: .4rem;
        font-size: .6rem;
        margin-bottom: .7rem;
        background-color: #fff;
        box-shadow: 0 20px 20px #e3e3e3;
        padding: .7rem;
        .page_user {
            display: flex;
            line-height: 1.8rem;
            .user_img {
                width: 1.8rem;
                height: 1.8rem;
                border-radius: 50%;
                overflow: hidden;
                img {
                    width: 100%;
                }
            }
            .user_name {
                font-size: .6rem;
                margin-left: .6rem;
            }
        }
        .page_moreImg {
            margin-top: .5rem;
            .more_img {
                width: calc((100% - 1.25rem)/3);
                height: 4.9rem;
                border-radius: .4rem;
                margin-right: .3rem;
                overflow: hidden;
                display: inline-block;
                img {
                    width: 100%;
                    height: 100%;
                    object-fit: cover;
                }
            }
            .last_img {
                position: relative;
                .img_num {
                    position: absolute;
                    right: 0;
                    bottom: 0;
                    min-width: 36px;
                    height: 36px;
                    background: rgba(0, 0, 0, .3);
                    border-radius: 16px 0 16px 0;
                    font-family: PingFangSC-Medium;
                    font-size: 24px;
                    color: #fff;
                    letter-spacing: 0;
                    line-height: 36px;
                    text-align: center;
                }
            }
        }
        .page_text {
            p {
                margin-top: .6rem;
                font-size: .3rem;
                color: #2d3f56;
                overflow: hidden;
                text-overflow: ellipsis;
                display: -webkit-box;
                -webkit-line-clamp: 2; //行数
                -webkit-box-orient: vertical;
            }
        }
        .page_bottom {
            margin-top: 1rem;
            overflow: hidden;
            .like,
            .img_common {
                width: .9rem;
                float: left;
                margin-right: 16px;
            }
            .like_content {
                margin-right: .4rem;
            }
            .page_text {
                font-size: .7rem;
            }
            span {
                font-family: PingFangSC-Medium;
                font-size: .7rem;
                color: #c9d6de;
                letter-spacing: 0;
                line-height: .7rem;
                float: left;
                margin-top: .2rem;
            }
            .time {
                font-size: .7rem;
                color: #bcbcbc;
                letter-spacing: 0;
                text-align: right;
                line-height: 1rem;
                float: right;
            }
        }
    }
    .newsletterBar {
        border-radius: .4rem;
        font-size: .65rem;
        margin-bottom: .7rem;
        background-color: #fff;
        box-shadow: 0 20px 20px #e3e3e3;
        padding: .7rem;
        .block_top {
            display: flex;
            .block_left {
                width: 5rem;
                height: 5rem;
                border-radius: .3rem;
                overflow: hidden;
                margin-right: .6rem;
                display: inline-block;
                img {
                    width: 100%;
                    height: 100%;
                    object-fit: cover;
                    vertical-align: bottom;
                }
            }
            .block_right {
                flex: 1;
                display: inline-block;
                .block_right_title {
                    width: 100%;
                    letter-spacing: 0;
                    overflow: hidden;
                    display: -webkit-box;
                    -webkit-line-clamp: 2;
                    -webkit-box-orient: vertical;
                    font-size: .8rem;
                    color: #0f2540;
                    line-height: 1.2rem;
                    text-overflow: ellipsis;
                    margin-top: .3rem;
                }
                .block_right_content {
                    height: 1.8rem;
                    font-size: .65rem;
                    color: #bcbcbc;
                    text-align: left;
                    line-height: .9rem;
                    margin-top: .3rem;
                    overflow: hidden;
                    text-overflow: ellipsis;
                    display: -webkit-box;
                    -webkit-line-clamp: 2; //行数
                    -webkit-box-orient: vertical;
                }
            }
        }
        .block_bottom {
            margin-top: 1rem;
            overflow: hidden;
            .like,
            .img_common {
                width: .9rem;
                float: left;
                margin-right: 16px;
            }
            .like_content {
                margin-right: .4rem;
            }
            .page_text {
                font-size: .7rem;
            }
            span {
                font-family: PingFangSC-Medium;
                font-size: .7rem;
                color: #c9d6de;
                letter-spacing: 0;
                line-height: .7rem;
                float: left;
                margin-top: .2rem;
            }
            .time {
                font-size: .7rem;
                color: #bcbcbc;
                letter-spacing: 0;
                text-align: right;
                line-height: 1rem;
                float: right;
            }
        }
    }
}